<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<canvas id="layer"></canvas>
<script>


    var c=document.getElementById('layer');
    var ctx=c.getContext('2d');
    c.width=640;
    c.height=896;
    ctx.rect(0,0,c.width,c.height);
    ctx.fillStyle='#fff';
    ctx.fill();

    var img=new Image;
    //img.crossOrigin = 'Anonymous'; //解决跨域
    img.src='tx.png';
    img.onload=function(){
        ctx.drawImage(img,300,500,200,100);
    };
    var bg=new Image;
    //img.crossOrigin = 'Anonymous'; //解决跨域
    bg.src='bg.png';
    bg.onload=function(){
        ctx.drawImage(bg,0,0,640,896);
    }

</script>
</body>
</html>